<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    <link rel="stylesheet" href="../bootstrap-3.3.7/css/bootstrap.min.css" />
    <script type="text/javascript" src="../bootstrap-3.3.7/js/jquery.js"></script>
    <script type="text/javascript" src="../bootstrap-3.3.7/js/bootstrap.min.js"></script>
    <base href="xxx{path}/">
</head>
<body>
<div class="container" style="margin:50px 10px 10px 10px" >
    <div class="row" style="margin-top: 20px;">
        <div class="form-group form-group-sm col-xs-4">
            <#--<label for="user_pt" class="col-sm-4 control-label" style="padding-top: 5px;">&nbsp;&nbsp;利息计算</label>-->
            <#--<div class="col-sm-6">
                <input type="text" class="form-control" id="user_pt" name="keyword" value="${p.keyword!}"  placeholder="请输入用户名称">
            </div>-->
            <input type="button" class="btn btn-info btn-lg" value="单息计算" onclick="one()">
        </div>
        <div class="form-group form-group-sm col-xs-4">
            <#--<label for="user_phone" class="col-sm-4 control-label" style="padding-top: 5px;">手机号码</label>
            <div class="col-sm-6">
                <input type="text" class="form-control" id="user_phone" name="keyquery" value="${p.keyquery!}" placeholder="请输入手机号">
            </div>-->
             <input type="button" class="btn btn-info btn-lg" value="复息计算" onclick="two()">
        </div>
        <#--<div class="form-group">
        &lt;#&ndash;<a href="" class="btn btn-success btn-primary btn-block ">查询</a>&ndash;&gt;
            <input type="button" value="利息入账" class="btn btn-success btn-lg ">
        </div>-->
        <br><br>
       <table id="tab"  class="table table-bordered table-hover table-striped">
        </table>
        <br><br><br><br>
    </div>


</div><!--/ row -->
</body>
<script type="text/javascript">
    function one() {
        var tab = $("#tab");
        tab.html("");
        tab.append('<tr>\n' +
                '               <td><input type="text" class="form-control" id="bj" placeholder="请输入贷款数额"></td>\n' +
                '           </tr>\n' +
                '           <tr>\n' +
                '               <td><input type="text"  class="form-control" id="time" placeholder="请输入贷款期限"></td>\n' +
                '           </tr>\n' +
                '           <tr>\n' +
                '               <td>\n' +
                '                   <input type="radio" value="1" name="ym" onclick="year()">年利率\n' +
                '                   <input type="radio" value="2" name="ym" onclick="month()">月利率\n' +
                '               </td>\n' +
                '           </tr>\n' +
                '           <tr>\n' +
                '               <td style="text-align: center" id="llvalue"></td>\n' +
                '           </tr>');
    }
    function year() {
        var bj = $("#bj").val();
        var time = $("#time").val();
        var interest=0;
        interest = bj*(1+(1*time)*(0.054));
        var lx = interest-bj;
        $("#llvalue").text("最终需要归还"+interest+","+"利息为:"+lx);
    }
    function month() {
        var bj = $("#bj").val();
        var time = $("#time").val();
        var interest=0;
        interest = bj*(1+(1*time)*(0.054/12));
        var lx = interest-bj;
        $("#llvalue").text("最终需要归还"+interest+","+"利息为:"+lx);
    }
    function two() {
        var tab = $("#tab");
        tab.html("");
        tab.append('<tr>\n' +
                '               <td><input type="text" class="form-control" id="bj" placeholder="请输入贷款数额"></td>\n' +
                '           </tr>\n' +
                '           <tr>\n' +
                '               <td><input type="text"  class="form-control" id="time" placeholder="请输入贷款期限"></td>\n' +
                '           </tr>\n' +
                '           <tr>\n' +
                '               <td>\n' +
                '                   <input type="radio" value="1" name="ym" onclick="years()">年利率\n' +
                '                   <input type="radio" value="2" name="ym" onclick="months()">月利率\n' +
                '               </td>\n' +
                '           </tr>\n' +
                '           <tr>\n' +
                '               <td style="text-align: center" id="llvalue"></td>\n' +
                '           </tr>');
    }
    function years() {
        var bj = $("#bj").val();
        var time = $("#time").val();
        var interest=0;
        interest = bj*(1+(0.12))^time;
        var lx = interest-bj;
        $("#llvalue").text("最终需要归还"+interest+","+"利息为:"+lx);
    }
    function months() {
        var bj = $("#bj").val();
        var time = $("#time").val();
        var interest=0;
        interest = bj*Math.pow(1.01,time);
       // alert( );
        var lx = interest-bj;
        $("#llvalue").text("最终需要归还"+interest+","+"利息为:"+lx);
    }
</script>
</html>